<template>
  <div>
    <el-form
      ref="headForm"
      :model="headData"
      size="mini"
      label-width="50px"
      style="width: 50vw"
      v-if="loaded"
    >
      <el-row>
        <!-- <el-col :span="2">
          <el-tooltip  effect="light"  placement="bottom">
            <div slot="content" >
              <span>{{initOptionsData["customerMap"][Constatvariable.customerId]}}</span>
            </div>
            <i>客户</i>
          </el-tooltip>
        </el-col> -->
        <el-col :span="3">
          <span>操作</span>
          <span>{{
            initOptionsData["userMap"][Constatvariable.operationId]
          }}</span>
        </el-col>
        <el-col :span="3">
          <span>{{
            initOptionsData["customerMap"][Constatvariable.customerId]
          }}</span>
        </el-col>
        <el-col :span="4">
          <el-tooltip effect="light" placement="bottom">
            <div slot="content">
              <div
                v-html="Constatvariable['customerRemark']"
                style="
                  max-width: 500px;
                  overflow: auto;
                  background: #e1e5e8;
                  font-size: 15px;
                  line-height: 16px;
                  color: #888;
                  max-height: 320px;
                "
              ></div>
              <!-- <el-table
              :data="customerReamrkData"
              style="width:800px;overflow:auto;"
            >
              <el-table-column prop="remark" label="客户备注" width="360">
              </el-table-column>
            </el-table> -->
            </div>
            <i
              v-if="
                null == Constatvariable['customerRemark'] ||
                  Constatvariable['customerRemark'] == ''
              "
              style="font-size: 20px"
              @mouseover="initcustomerReamrkData"
              class="el-icon-user-solid"
            ></i>
            <i
              v-else
              style="font-size: 20px; color: red"
              @mouseover="initcustomerReamrkData"
              class="el-icon-user-solid"
            ></i>
          </el-tooltip>
          <el-tooltip effect="light" placement="top">
            <!-- 物流轨迹 -->
            <div slot="content">
              <el-table
                :data="tableData"
                style="width: 600px; overflow: auto; max-height: 300px"
              >
                <el-table-column prop="time" label="时间" width="100">
                </el-table-column>
                <el-table-column prop="address" label="地点" width="100">
                </el-table-column>
                <el-table-column
                  prop="operationName"
                  label="操作人"
                  width="100"
                >
                </el-table-column>
                <el-table-column prop="track" label="轨迹" width="100">
                </el-table-column>
              </el-table>
            </div>
            <i
              style="font-size: 20px"
              class="el-icon-truck"
              @mouseover="queryShippingTraceByWaybillId"
            ></i>
          </el-tooltip>
          <el-tooltip effect="light" placement="bottom">
            <div slot="content">
              <div
                v-html="Constatvariable['sysRemark']"
                style="
                  max-width: 500px;
                  overflow: auto;
                  background: #e1e5e8;
                  font-size: 15px;
                  line-height: 16px;
                  color: #888;
                  max-height: 320px;
                "
              ></div>
              <!-- <el-table
              :data="sysReamrkData"
              style="width:800px;overflow:auto;"
              >
              <el-table-column
                prop="remark"
                label="系统备注"
                width="360">
              </el-table-column>
            </el-table> -->
            </div>
            <i
              style="font-size: 20px"
              @mouseover="initSysRemark"
              class="el-icon-s-flag"
            ></i>
          </el-tooltip>

          <el-tooltip effect="light" placement="bottom" content="已锁单">
            <img :src="suoPng" v-if="Constatvariable.orderLocked === 1" />
          </el-tooltip>
        </el-col>
        <el-col
          :span="3"
          v-if="Constatvariable.hdType == 0 || Constatvariable.hdType == 1"
        >
          客服: {{ initOptionsData["userMap"][Constatvariable.servicesId] }}
        </el-col>
        <el-col :span="1" v-else>
          <template>
            <el-tooltip
              effect="light"
              placement="top"
              v-if="
                !verifyShow.saler &&
                  !verifyShow.seller &&
                  !verifyShow.saleAssistant &&
                  ['seaFreightHD', 'seaFreight'].includes(pageType)
              "
            >
              <div slot="content" style="width: 500px">
                <el-row>
                  <el-col :span="6"
                    ><el-button
                      @click="
                        viewWaybillMasterAndHouseNumber(
                          0,
                          'COPY',
                          Constatvariable.id
                        )
                      "
                      type="text"
                      >COPY</el-button
                    ></el-col
                  >
                  <el-col :span="6"
                    ><el-button
                      @click="
                        waybillMasterAndHousePdf(0, 'copy', Constatvariable.id)
                      "
                      type="text"
                      >COPY(PDF)</el-button
                    ></el-col
                  >
                  <el-col :span="6">
                    <el-button
                      @click="
                        viewWaybillMasterAndHouseNumber(
                          0,
                          'SURRENDERED',
                          Constatvariable.id
                        )
                      "
                      type="text"
                      >SURRENDERED</el-button
                    ></el-col
                  >
                  <el-col :span="6">
                    <el-button
                      @click="
                        waybillMasterAndHousePdf(
                          0,
                          'surrendered',
                          Constatvariable.id
                        )
                      "
                      type="text"
                      >SURRENDERED(PDF)</el-button
                    ></el-col
                  >
                </el-row>
                <el-row v-for="(item, k) in singleOptions" :key="k">
                  <el-col :span="4">分单{{ item }}</el-col>
                  <el-col :span="2"
                    ><el-button
                      @click="viewWaybillMasterAndHouseNumber(0, 'COPY', k)"
                      type="text"
                      >COPY</el-button
                    ></el-col
                  >
                  <el-col :span="6"
                    ><el-button
                      @click="waybillMasterAndHousePdf(0, 'copy', k)"
                      type="text"
                      >COPY(PDF)</el-button
                    ></el-col
                  >
                  <el-col :span="6">
                    <el-button
                      @click="
                        viewWaybillMasterAndHouseNumber(0, 'SURRENDERED', k)
                      "
                      type="text"
                      >SURRENDERED</el-button
                    ></el-col
                  >
                  <el-col :span="6">
                    <el-button
                      @click="waybillMasterAndHousePdf(0, 'surrendered', k)"
                      type="text"
                      >SURRENDERED(PDF)</el-button
                    ></el-col
                  >
                </el-row>
              </div>
              <i>M单</i>
            </el-tooltip>
          </template>
        </el-col>
        <el-col
          :span="1"
          v-if="Constatvariable.hdType == 0 || Constatvariable.hdType == 1"
        >
        </el-col>
        <el-col :span="2" v-else>
          <el-tooltip
            effect="light"
            placement="top"
            v-if="
              !verifyShow.saler &&
                !verifyShow.seller &&
                !verifyShow.saleAssistant
            "
          >
            <div slot="content">
              <el-button type="text">导出</el-button>
            </div>
            <i>Booking</i>
          </el-tooltip>
        </el-col>
        <el-col :span="1">
          <div
            v-if="Constatvariable.hdType == 0 || Constatvariable.hdType == 1"
          >
            <extremeList :data="Constatvariable"></extremeList>
          </div>
          <div v-else>
            <seaairlist :data="Constatvariable"></seaairlist>
          </div>
        </el-col>

      </el-row>
      <el-row style="padding: 10px 0">
        <el-col :span="2">
          <el-tooltip effect="light" placement="top">
            <div slot="content" style="height: 20px; width: 200px">
              {{ Constatvariable.referenceNo }}
            </div>
            <span>参考号</span>
          </el-tooltip>
        </el-col>

        <el-col :span="3">
          <span
            >海外:{{
              initOptionsData["userMap"][Constatvariable.overseasOperatorId]
            }}</span
          >
        </el-col>
        <el-col :span="5">
          <span style="font-size: 16px">{{
            Constatvariable.masterNumber
          }}</span>
        </el-col>
        <el-col
          :span="4"
          v-if="Constatvariable.hdType == 0 || Constatvariable.hdType == 1"
        >
          <el-tooltip effect="light" content="起运港账单" placement="top">
            <img v-if="yesbillstatus" :src="yesbillstatus" />
          </el-tooltip>
          <el-tooltip effect="light" content="目的港账单" placement="top">
            <img v-if="portdestination0" :src="portdestination0" />
          </el-tooltip>

          <el-tooltip
            effect="light"
            content=""
            placement="top"
            v-if="mergerdeclaration"
          >
            <img v-if="mergerdeclaration" :src="mergerdeclaration" />
          </el-tooltip>

          <el-tooltip effect="light" content="" placement="top">
            <img
              v-if="payforcustomsdeclaration"
              :src="payforcustomsdeclaration"
            />
          </el-tooltip>
          <el-tooltip effect="light" content="" placement="top">
            <img
              v-if="payforcustomsdeclarationgreen"
              :src="payforcustomsdeclarationgreen"
            />
          </el-tooltip>
          <el-tooltip effect="light" content="" placement="top">
            <img v-if="waybillyesvat" :src="waybillyesvat" />
          </el-tooltip>
          <el-tooltip effect="light" content="" placement="top">
            <img v-if="isbuyinsurance" :src="isbuyinsurance" />
          </el-tooltip>
          <el-tooltip
            effect="light"
            content=""
            placement="top"
            v-if="null != Constatvariable.isPVA"
          >
            <img v-if="ispva0" :src="ispva0" />
          </el-tooltip>
        </el-col>
        <el-col
          :span="1"
          v-if="Constatvariable.hdType == 0 || Constatvariable.hdType == 1"
        >
        </el-col>
        <el-col :span="1" v-else>
          <template>
            <el-tooltip
              effect="light"
              placement="top"
              v-if="
                !verifyShow.saler &&
                  !verifyShow.seller &&
                  !verifyShow.saleAssistant &&
                  ['seaFreightHD', 'seaFreight'].includes(pageType)
              "
            >
              <div slot="content" style="width: 500px">
                <el-row>
                  <el-col :span="6"
                    ><el-button
                      @click="
                        viewWaybillMasterAndHouseNumber(
                          1,
                          'COPY',
                          Constatvariable.id
                        )
                      "
                      type="text"
                      >COPY</el-button
                    ></el-col
                  >
                  <el-col :span="6"
                    ><el-button
                      @click="
                        waybillMasterAndHousePdf(1, 'copy', Constatvariable.id)
                      "
                      type="text"
                      >COPY(PDF)</el-button
                    ></el-col
                  >
                  <el-col :span="6">
                    <el-button
                      @click="
                        viewWaybillMasterAndHouseNumber(
                          1,
                          'SURRENDERED',
                          Constatvariable.id
                        )
                      "
                      type="text"
                      >SURRENDERED</el-button
                    ></el-col
                  >
                  <el-col :span="6">
                    <el-button
                      @click="
                        waybillMasterAndHousePdf(
                          1,
                          'surrendered',
                          Constatvariable.id
                        )
                      "
                      type="text"
                      >SURRENDERED(PDF)</el-button
                    ></el-col
                  >
                </el-row>
                <el-row v-for="(item, k) in singleOptions" :key="k">
                  <el-col :span="4">分单{{ item }}</el-col>
                  <el-col :span="2"
                    ><el-button
                      @click="viewWaybillMasterAndHouseNumber(1, 'COPY', k)"
                      type="text"
                      >COPY</el-button
                    ></el-col
                  >
                  <el-col :span="6"
                    ><el-button
                      @click="waybillMasterAndHousePdf(1, 'copy', k)"
                      type="text"
                      >COPY(PDF)</el-button
                    ></el-col
                  >
                  <el-col :span="6">
                    <el-button
                      @click="
                        viewWaybillMasterAndHouseNumber(1, 'SURRENDERED', k)
                      "
                      type="text"
                      >SURRENDERED</el-button
                    ></el-col
                  >
                  <el-col :span="6">
                    <el-button
                      @click="waybillMasterAndHousePdf(1, 'surrendered', k)"
                      type="text"
                      >SURRENDERED(PDF)</el-button
                    ></el-col
                  >
                </el-row>
              </div>
              <i>H单</i>
            </el-tooltip>
          </template>
        </el-col>

        <el-col :span="3">
          <div class="flex-sub text-cut">
            <span>状态：</span>
            <span class="text-red">{{
              m(initOptionsData[`waybillStatusMap`][Constatvariable.status])
            }}</span>
          </div>
        </el-col>
        <el-col :span="3">
          <div class="flex-sub text-cut">
            <span>起运港：</span>
            <span
              v-if="
                this.Constatvariable['shippingWay'] == 'LCL' ||
                  this.Constatvariable['shippingWay'] == 'FCL'
              "
              >{{
                m(
                  initOptionsData["configPortMap"][Constatvariable.shipmentPort]
                )
              }}</span
            >
            <span>{{
              m(initOptionsData["airPortMap"][Constatvariable.shipmentPort])
            }}</span>
          </div>
        </el-col>
        <el-col :span="3">
          <div class="flex-sub text-cut">
            <span>中转港：</span>
            <span
              v-if="
                this.Constatvariable['shippingWay'] == 'LCL' ||
                  this.Constatvariable['shippingWay'] == 'FCL'
              "
              >{{
                m(
                  initOptionsData["configPortMap"][Constatvariable.transferPort]
                )
              }}</span
            >
            <span>{{
              m(initOptionsData["airPortMap"][Constatvariable.transferPort])
            }}</span>
          </div>
        </el-col>
        <el-col :span="3">
          <div class="flex-sub text-cut">
            <span>目的港：</span>
            <span
              v-if="
                this.Constatvariable['shippingWay'] == 'LCL' ||
                  this.Constatvariable['shippingWay'] == 'FCL'
              "
              >{{
                m(
                  initOptionsData["configPortMap"][
                    Constatvariable.destinationPort
                  ]
                )
              }}</span
            >
            <span>{{
              m(initOptionsData["airPortMap"][Constatvariable.destinationPort])
            }}</span>
          </div>
        </el-col>

      </el-row>
      <el-row>
        <el-row>
          <el-col :span="3" >
            <div class=" text-cut  flex align-center">
              <span>订舱补料：</span>
              <span
                v-if="
                    this.Constatvariable['bookingSpaceUser'] == '' ||
                      this.Constatvariable['bookingSpaceUser'] == null
                  "
              >
                  <el-popover placement="right" width="400" trigger="click">
                    <el-select
                      v-model="Constatvariable.bookingSpaceUser"
                      placeholder="请选择"
                      clearable
                      @change="saveBookingSpace"
                      filterable
                      :style="{ width: '100%' }"
                    >
                      <el-option
                        v-for="(k, v) in bangdingUserOptions"
                        :key="k"
                        :label="bangdingUserOptions[v]"
                        :value="v"
                      ></el-option>
                    </el-select>
                    <img :src="fileReadPng" slot="reference" /> </el-popover
                  ></span>
              <span v-else>
                  {{
                    initOptionsData["bangdingUserMap"][Constatvariable.bookingSpaceUser]
                  }}
                </span>
            </div>
          </el-col>
          <el-col :span="3" >
            <div class=" text-cut  flex align-center">
              <span>清关文件：</span>
              <span
                v-if="
                    this.Constatvariable['customsClearanceUser'] == '' ||
                      this.Constatvariable['customsClearanceUser'] == null
                  "
              >
                  <el-popover placement="right" width="400" trigger="click">
                    <el-select
                      v-model="Constatvariable.customsClearanceUser"
                      placeholder="请选择"
                      clearable
                      @change="saveCustomsClearance"
                      filterable
                      :style="{ width: '100%' }"
                    >
                      <el-option
                        v-for="(k, v) in bangdingUserOptions"
                        :key="k"
                        :label="bangdingUserOptions[v]"
                        :value="v"
                      ></el-option>
                    </el-select>
                    <img :src="fileReadPng" slot="reference" />
                  </el-popover>
                </span>
              <span v-else>
                  {{
                    initOptionsData["bangdingUserMap"][
                      Constatvariable.customsClearanceUser
                    ]
                  }}
                </span>
            </div>
          </el-col>
          <el-col :span="3">
            <div class="text-cut  flex align-center">
              <span>后端跟进：</span>
              <span
                v-if="
                    this.Constatvariable['backEndFollowUser'] == '' ||
                      this.Constatvariable['backEndFollowUser'] == null
                  "
              >
                  <el-popover placement="right" width="400" trigger="click">
                    <el-select
                      v-model="Constatvariable.backEndFollowUser"
                      placeholder="请选择"
                      clearable
                      @change="saveBackEndFollow"
                      filterable
                      :style="{ width: '100%' }"
                    >
                      <el-option
                        v-for="(k, v) in bangdingUserOptions"
                        :key="k"
                        :label="bangdingUserOptions[v]"
                        :value="v"
                      ></el-option>
                    </el-select>
                    <img :src="fileReadPng" slot="reference" />
                  </el-popover>
                </span>
              <span v-else>
                  {{
                    initOptionsData["bangdingUserMap"][
                      Constatvariable.backEndFollowUser
                    ]
                  }}
                </span>
            </div>
          </el-col>
          <el-col :span="3" >
            <div class=" text-cut flex align-center">
              <span>后端派送：</span>
              <span
                v-if="
                    this.Constatvariable['backEndDeliveryUser'] == '' ||
                      this.Constatvariable['backEndDeliveryUser'] == null
                  "
              >
                  <el-popover placement="right" width="400" trigger="click">
                    <el-select
                      v-model="Constatvariable.backEndDeliveryUser"
                      placeholder="请选择"
                      clearable
                      @change="saveBackEndDelivery"
                      filterable
                      :style="{ width: '100%' }"
                    >
                      <el-option
                        v-for="(k, v) in bangdingUserOptions"
                        :key="k"
                        :label="bangdingUserOptions[v]"
                        :value="v"
                      ></el-option>
                    </el-select>
                    <img :src="fileReadPng" slot="reference" /> </el-popover
                  ></span>
              <span v-else>
                  {{
                    initOptionsData["bangdingUserMap"][
                      Constatvariable.backEndDeliveryUser
                    ]
                  }}
                </span>
            </div>
          </el-col>
          <el-col :span="2" v-if="loaded && permission('update_binding')">
            <el-button
              type="success"
              class="fr"
              size="mini"

              @click="dialogVisible = true"
            >编辑</el-button
            >
          </el-col>
        </el-row>
      </el-row>
    </el-form>
    <el-dialog
      :visible.sync="dialogVisible"
      width="50%"
      :append-to-body="true"
      :before-close="handleClose"
    >
      <template>
        <el-col :span="5">
          <div class="flex-sub text-cut">
            <span>订舱补料：</span>
            <el-select
              v-model="Constatvariable.bookingSpaceUser"
              placeholder="请选择"
              clearable
              filterable
              :style="{ width: '50%' }"
            >
              <el-option
                v-for="(k, v) in bangdingUserOptions"
                :key="k"
                :label="bangdingUserOptions[v]"
                :value="parseInt(v)"
              ></el-option>
            </el-select>
          </div>
        </el-col>
        <el-col :span="5">
          <div class="flex-sub text-cut">
            <span>清关文件：</span>
            <el-select
              v-model="Constatvariable.customsClearanceUser"
              placeholder="请选择"
              clearable
              filterable
              :style="{ width: '50%' }"
            >
              <el-option
                v-for="(k, v) in bangdingUserOptions"
                :key="k"
                :label="bangdingUserOptions[v]"
                :value="parseInt(v)"
              ></el-option>
            </el-select>
          </div>
        </el-col>
        <el-col :span="5">
          <div class="flex-sub text-cut">
            <span>后端跟进：</span>
            <el-select
              v-model="Constatvariable.backEndFollowUser"
              placeholder="请选择"
              clearable
              filterable
              :style="{ width: '50%' }"
            >
              <el-option
                v-for="(k, v) in bangdingUserOptions"
                :key="k"
                :label="bangdingUserOptions[v]"
                :value="parseInt(v)"
              ></el-option>
            </el-select>
          </div>
        </el-col>
        <el-col :span="5">
          <div class="flex-sub text-cut">
            <span>后端派送：</span>
            <el-select
              v-model="Constatvariable.backEndDeliveryUser"
              placeholder="请选择"
              clearable
              filterable
              :style="{ width: '50%' }"
            >
              <el-option
                v-for="(k, v) in bangdingUserOptions"
                :key="k"
                :label="bangdingUserOptions[v]"
                :value="parseInt(v)"
              ></el-option>
            </el-select>
          </div>
        </el-col>
      </template>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="updateBinding">确定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { ajax, actionPermission } from "@/store/yg/common/utils";
import axios from "axios";
import * as constant from "@/store/yg/common/constant";
import { m } from "@/store/yg/common/local";
import suoPng from "@/assets/images/suo.png";
import fileReadPng from "@/assets/images/file-read.png";
import yesbillstatusPng from "@/assets/images/yesbillstatus.png";
import nobillstatusPng from "@/assets/images/nobillstatus.png";
import portdestination0Png from "@/assets/images/portdestination0.png";
import portdestination1Png from "@/assets/images/portdestination1.png";
import ispva1Png from "@/assets/images/ispva1.png";
import ispva0Png from "@/assets/images/ispva0.png";
import isbuyinsurancePng from "@/assets/images/isbuyinsurance.png";
import nobuyinsurancePng from "@/assets/images/nobuyinsurance.png";
import mergerdeclarationPng from "@/assets/images/mergerdeclaration.jpeg";
import waybillyesvatPng from "@/assets/images/waybillyesvat.png";
import waybillnovatPng from "@/assets/images/waybillnovat.png";
import waybillredvatPng from "@/assets/images/waybillredvat.png";

import payforcustomsdeclarationPng from "@/assets/images/payfor_customs_declaration.png";
import payforcustomsdeclarationbluePng from "@/assets/images/payforcustomsdeclarationblue.png";
import payforcustomsdeclarationgreenPng from "@/assets/images/payforcustomsdeclarationgreen.png";
import twomixdeclarationPng from "@/assets/images/two_mix_declaration.png";
import generalgreendeclarationPng from "@/assets/images/general_green_declaration.png";
import generalbusinessdeclarationPng from "@/assets/images/general_business_declaration.png";
const seaairlist = () =>
  import("@/components/app/main/waybill/operation/seaairmergelist");
const extremeList = () =>
  import("@/components/app/main/waybill/operation/seaairextreme");

export default {
  components: {
    seaairlist,
    extremeList
  },
  props: {
    pageType: {
      type: String,
      required: true,
      default: "seaFreight"
    },
    Constatvariable: {
      type: Object,
      default: function() {
        return {};
      }
    },
    verifyShow: {
      type: Object,
      default: function() {
        return {};
      }
    },
    initOptionsData: {
      type: Object,
      default: function() {
        return {};
      }
    },
    singleOptions: {
      type: Object,
      default: function() {
        return {};
      }
    },
    data: {
      type: Object,
      default: function() {
        return {};
      }
    }
  },
  data() {
    return {
      loaded: true,
      dialogVisible: false,
      fileReadPng: fileReadPng,
      isMerge: true,
      tableData: [],
      sysReamrkData: [],
      customerReamrkData: [],
      // 锁
      suoPng: suoPng,
      //  起 - yes
      yesbillstatus: yesbillstatusPng,
      nobillstatus: nobillstatusPng,
      //  目
      portdestination0: portdestination0Png,
      portdestination1: portdestination1Png,
      // PVA
      ispva1: ispva1Png,
      ispva0: ispva0Png,

      isbuyinsurance: isbuyinsurancePng,
      nobuyinsurance: nobuyinsurancePng,

      // 合
      mergerdeclaration: mergerdeclarationPng,

      // VAT
      waybillyesvat: waybillyesvatPng,
      waybillnovat: waybillnovatPng,
      waybillredvat: waybillredvatPng,

      // 报
      payforcustomsdeclaration: payforcustomsdeclarationPng,
      payforcustomsdeclarationblue: payforcustomsdeclarationbluePng,
      payforcustomsdeclarationgreen: "",
      generalgreendeclaration: generalgreendeclarationPng,
      generalbusinessdeclaration: generalbusinessdeclarationPng,

      headData: {},
      tarckInfo: [],
      resModel: {
        estimatedDepartureTime: "",
        boxType: "",
        defaultBoxType: "",
        totalNumberOfContainersOfPackages: "",
        containerInformationList: "",
        simpleWaybillQuery: "",
        billType: "",
        operationType: "",
        packageType: "",
        configPortMap: {},
        airPortMap: {},
        configShipMap: {}
      },
      waybillId: "",
      userOptions: [],
      bangdingUserOptions:[],
      rules: {}
    };
  },

  methods: {
    m(k) {
      return m(k);
    },
    displayRules() {
      this.loaded = false;
      this.rules = {};
      var uri = "/waybill/seafreightmerge/list";
      if (this.Constatvariable.shippingWay == "AIR" || this.Constatvariable.shippingWay == "ZX") {
        uri = "/waybill/airfreightmerge/list";
      } else if (this.Constatvariable.shippingWay == "LCL" || this.Constatvariable.shippingWay == "FCL") {
        var uri = "/waybill/seafreightmerge/list";
      }
      console.log("看看url是多少:",uri);
      if (!this.$store.state.main.entry || this.$store.state.main.entry.uri != uri) {
        let mainUri = "/api/entry/main?uri=" + uri;

        axios
          .post(constant.API_SERVER + mainUri)
          .then(response => {
            response.data.table.action.forEach(element => {
              if (element.displayRule) {
                this.rules[element.client.commit] = element.displayRule;
              }
            });
            console.log("看看请求出来的是什么：",constant.API_SERVER + mainUri)
            console.log("看看请求出来的是什么1：",element.displayRule)
            console.log("看看请求出来的是什么2：",this.rules[element.client.commit])
            this.loaded = true;
          })
          .catch(error => {
            this.loaded = true;
          });
      } else {
        for (var i in this.$store.state.main.entry.table.action) {
          let a = this.$store.state.main.entry.table.action[i];
          if (a.displayRule) {
            this.rules[a.client.commit] = a.displayRule;
          }
        }
        this.loaded = true;
      }
      console.log("判断权限", this.permission("update_binding"));
    },
    handleClose(done) {
      this.$confirm("确认关闭？")
        .then(_ => {
          done();
        })
        .catch(_ => {});
    },
    updateBinding() {
      var params = {};
      params[
        "customsClearanceUser"
      ] = this.Constatvariable.customsClearanceUser;
      params["bookingSpaceUser"] = this.Constatvariable.bookingSpaceUser;
      params["backEndFollowUser"] = this.Constatvariable.backEndFollowUser;
      params["backEndDeliveryUser"] = this.Constatvariable.backEndDeliveryUser;
      this.saveBinding(params);
    },
    permission(commit) {
      console.log("进入权限判断:",  this.rules)
      console.log("进入权限判断参数1:",  this.Constatvariable)
      console.log("进入权限判断参数2:",  this.$store.state)
      const result = actionPermission(
        this.rules,
        commit,
        this.Constatvariable,
        this.$store.state
      );
      console.log("结果：", commit, result);
      return result;
    },
    saveCustomsClearance(val) {
      var params = {};
      params["customsClearanceUser"] = val;
      params["bookingSpaceUser"] = this.Constatvariable.bookingSpaceUser;
      params["backEndFollowUser"] = this.Constatvariable.backEndFollowUser;
      params["backEndDeliveryUser"] = this.Constatvariable.backEndDeliveryUser;
      this.saveBinding(params);
    },
    saveBookingSpace(val) {
      var params = {};
      params["bookingSpaceUser"] = val;
      params[
        "customsClearanceUser"
      ] = this.Constatvariable.customsClearanceUser;
      params["backEndFollowUser"] = this.Constatvariable.backEndFollowUser;
      params["backEndDeliveryUser"] = this.Constatvariable.backEndDeliveryUser;
      this.saveBinding(params);
    },
    saveBackEndFollow(val) {
      var params = {};
      params["backEndFollowUser"] = val;
      params[
        "customsClearanceUser"
      ] = this.Constatvariable.customsClearanceUser;
      params["bookingSpaceUser"] = this.Constatvariable.bookingSpaceUser;
      params["backEndDeliveryUser"] = this.Constatvariable.backEndDeliveryUser;
      this.saveBinding(params);
    },
    saveBackEndDelivery(val) {
      var params = {};
      params["backEndDeliveryUser"] = val;
      params[
        "customsClearanceUser"
      ] = this.Constatvariable.customsClearanceUser;
      params["bookingSpaceUser"] = this.Constatvariable.bookingSpaceUser;
      params["backEndFollowUser"] = this.Constatvariable.backEndFollowUser;
      this.saveBinding(params);
    },
    saveBinding(params) {
      params["id"] = this.waybillId;
      console.log("传参:", params);
      ajax("saveBinding", params).then(
        res => {
          if (res.code == 200) {
            this.dialogVisible = false;
            this.$message({
              type: "success",
              message: "操作成功"
            });
          }
        },
        error => {
          console.log(error);
        }
      );
    },
    queryShippingTraceByWaybillId() {
      var params = {};
      params["id"] = this.waybillId;
      ajax("queryShippingTraceByWaybillId", params).then(
        res => {
          if (res.code == 200) {
            this.tableData = res.data;
            //跳转到新页面
          } else {
            this.tableData.push("暂时没有物流信息，请耐心等待");
          }
        },
        error => {
          console.log(error);
        }
      );
    },
    waybillMasterAndHousePdf(billType, operationType, waybillId) {
      var params = {};
      var ids = [];
      if (waybillId) {
        ids.push(waybillId);
      } else {
        ids.push(this.waybillId);
      }

      params["billType"] = billType;
      params["operationType"] = operationType;
      params["ids"] = ids;
      ajax("waybillMasterAndHouseNumberLoading", params).then(
        res => {
          console.log("下载PDF", res);
          if (res.errorMesage) {
            this.$message.error(m(res.errorMesage));
          } else {
            var path = (path = constant.FILE_SERVER + res.path);
            var fileUrl = path + res.fileName;
            console.log(fileUrl);
            window.open(fileUrl);
          }
        },
        error => {
          console.log(error);
        }
      );
    },

    viewWaybillMasterAndHouseNumber(billType, operationType, waybillId) {
      console.log("billType :>> ", billType);
      console.log("operationType :>> ", operationType);
      if (!waybillId) {
        waybillId = this.waybillId;
      }
      var url = "/#/view/waybillMasterAndHouseNumber?waybillId=" + waybillId;
      url = url + "&billType=" + billType + "&operationType=" + operationType;
      console.log("url :>> ", url);
      window.open(url);
    },

    // viewWaybillMasterAndHouseNumber(billType, operationType) {
    //   var params = {};
    //   params["billType"] = billType;
    //   params["operationType"] = operationType;
    //   params["id"] = this.$route.query.waybillId;
    //   ajax("viewWaybillMasterAndHouseNumber", params).then(
    //     res => {
    //       if (res.code == 200) {
    //         this.resModel = res.data;
    //         //跳转到新页面
    //       } else {
    //         if (null != res.message) {
    //           this.$message.error(m(res.message));
    //         } else {
    //           this.$message.error("修改失败!");
    //         }
    //       }
    //     },
    //     error => {
    //       console.log(error);
    //     }
    //   );
    // },
    initcustomerReamrkData() {
      this.customerReamrkData = [];
      var systemReamrks = this.Constatvariable["customerRemark"];
      if (systemReamrks) {
        var remarks = systemReamrks.split("<br/>");
        remarks.forEach(element => {
          var sysRemark = {};
          sysRemark["remark"] = element;
          this.customerReamrkData.push(sysRemark);
        });
      }
    },

    initSysRemark() {
      this.sysReamrkData = [];
      var systemReamrks = this.Constatvariable["sysRemark"];
      if (systemReamrks) {
        var remarks = systemReamrks.split("<br/>");
        remarks.forEach(element => {
          var sysRemark = {};
          sysRemark["remark"] = element;
          this.sysReamrkData.push(sysRemark);
        });
      }
    },
    async checkUploadCustomsDeclaration() {
      const data = await ajax("checkUploadCustomsDeclaration", {
        id: this.waybillId
      });
      if (data.data) {
        this.payforcustomsdeclaration = generalgreendeclarationPng;
      } else {
        this.payforcustomsdeclaration = generalbusinessdeclarationPng;
      }
      if (data.data2) {
        this.payforcustomsdeclarationgreen = payforcustomsdeclarationgreenPng;
      }
    },
    initShow(
      selfDelivered,
      isShowTDpic,
      billStatus,
      portOfDestinationBillStatus,
      isCustomerDeclaration,
      isPVA,
      isBuyInsurance,
      mergerDeclarationNo,
      isVatAndEori,
      eoriIsCertified
    ) {
      if (null != billStatus && billStatus == 1) {
        this.yesbillstatus = yesbillstatusPng;
      } else {
        this.yesbillstatus = nobillstatusPng;
      }

      if (
        null != portOfDestinationBillStatus &&
        portOfDestinationBillStatus == 0
      ) {
        this.portdestination0 = portdestination0Png;
      } else {
        this.portdestination0 = portdestination1Png;
      }

      if (null != isPVA && isPVA == 1) {
        this.ispva0 = ispva1Png;
      } else {
        this.ispva0 = ispva0Png;
      }

      if (isVatAndEori == 1 && eoriIsCertified == 1) {
        this.waybillyesvat = waybillyesvatPng;
      } else if (
        (isVatAndEori == 1 && eoriIsCertified == 0) ||
        (isVatAndEori == 1 && eoriIsCertified == null)
      ) {
        this.waybillyesvat = waybillredvatPng;
      } else {
        this.waybillyesvat = waybillnovatPng;
      }

      // 42 43 兼容老数据
      if (isCustomerDeclaration == 0 || isCustomerDeclaration == 42) {
        this.payforcustomsdeclaration = payforcustomsdeclarationPng;
      } else if (isCustomerDeclaration == 1 || isCustomerDeclaration == 43) {
        this.checkUploadCustomsDeclaration();
      } else {
        this.payforcustomsdeclaration = twomixdeclarationPng;
      }
      if (null != isBuyInsurance && isBuyInsurance == 1) {
        this.isbuyinsurance = isbuyinsurancePng;
      } else {
        this.isbuyinsurance = nobuyinsurancePng;
      }
      if (!mergerDeclarationNo) {
        this.mergerdeclaration = false;
      }
    }
  },

  mounted() {
    this.displayRules();
    console.log("判断权限", this.permission("update_binding"));
    this.userOptions = this.initOptionsData["userMap"];
    this.bangdingUserOptions=this.initOptionsData["bangdingUserMap"];
    console.log(
      "customsClearanceUser:",
      this.Constatvariable["customsClearanceUser"]
    );
    console.log("bookingSpaceUser:", this.Constatvariable.bookingSpaceUser);
    console.log("backEndFollowUser:", this.Constatvariable.backEndFollowUser);
    console.log(
      "backEndDeliveryUser:",
      this.Constatvariable.backEndDeliveryUser
    );
    console.log("数据集:", this.data);

    this.waybillId = this.$route.query.waybillId;
    const selfDelivered = this.Constatvariable["selfDelivered"];
    const isShowTDpic = this.Constatvariable["isShowTDpic"];
    const billStatus = this.Constatvariable["billStatus"];
    const portOfDestinationBillStatus = this.Constatvariable[
      "portOfDestinationBillStatus"
    ];
    const isCustomerDeclaration = this.Constatvariable["isCustomerDeclaration"];
    const isPVA = this.Constatvariable["isPVA"];
    const isVatAndEori = this.Constatvariable["isVatAndEori"];
    const eoriIsCertified = this.Constatvariable["eoriIsCertified"];
    const isBuyInsurance = this.Constatvariable["isBuyInsurance"];
    const mergerDeclarationNo = this.Constatvariable["mergerDeclarationNo"];
    this.initShow(
      selfDelivered,
      isShowTDpic,
      billStatus,
      portOfDestinationBillStatus,
      isCustomerDeclaration,
      isPVA,
      isBuyInsurance,
      mergerDeclarationNo,
      isVatAndEori,
      eoriIsCertified
    );
  }
};
</script>

<style></style>
